<template>
	<div class="indbox">
		<h3 style="margin:20px auto;">录入入职信息</h3>
		<el-form :model="form" label-width="100px" label="入职" :rules="rules">
			<el-form-item label="姓  名:" prop="ename">
				<el-input v-model="form.ename" autocoplete="off"></el-input>
			</el-form-item>
			<el-form-item label="性  别:">
				<div style="width:140px">
					<el-radio v-model="form.sex" label="0">男</el-radio>
					<el-radio v-model="form.sex" label="1">女</el-radio>
				</div>
			</el-form-item>
			<el-form-item label="电  话:" prop="tel">
				<el-input v-model="form.tel" autocoplete="off"></el-input>
			</el-form-item>
			<el-form-item label="出生日期:" prop="birth">
					<el-date-picker default-value="1995-1-1" type="date" placeholder="选择日期" format="yyyy-MM-d" value-format="yyyy-MM-d" :picker-options="pickerOptions" v-model="form.birth"></el-date-picker>
			</el-form-item>
			<el-form-item label="家庭地址:" prop="adss">
				<el-cascader 
					style="float:left"
					size="large"
					:options="options"
					v-model="selectedOptions"
					@change="handleChange">
				</el-cascader>
			</el-form-item>
			<el-form-item label="职  位:">
				<div style="width:200px">
					<el-radio v-model="form.job" label="stuff">普通员工</el-radio>
					<el-radio v-model="form.job" label="manager">经理</el-radio>
				</div>
			</el-form-item>
			<el-form-item label="工资:" prop="salary">
				<el-input v-model="form.salary" autocoplete="off"></el-input>
			</el-form-item>
			<el-button type="primary" @click="sureAdd">确 定</el-button>
		</el-form>
	</div>
</template>

<script>
	import { regionDataPlus,CodeToText,TextToCode } from 'element-china-area-data'
	export default {
		data() {
			return {
				rules:{
					/* 验证的对象 */
					ename:[
						{ required: true, message: '请输入姓名', trigger: 'blur'},
					],
					tel:[
						{ required: true, message: '请输入手机号', trigger: 'blur'},
						{ pattern: /^1(3|4|5|6|7|8)\d{9}$/, message: '请输入正确的手机号', trigger: 'blur'},
					],
					birth:[
						{ required: true, message: '请输入出生日期', trigger: 'blur'},
					],
					adss:[
						{ required: true, message: '请输入家庭地址', trigger: 'blur'},
					],
					salary:[
						{ required: true, message: '请输入工资', trigger: 'blur'},
						{ pattern: /^[1-9]{1}[0-9]{0,}$/, message: '请输入正确的工资形式', trigger: 'blur'},
					],
				},
				form:{
						ename:'',
						sex:'0',
						tel:'',
						birth:'',
						salary:'',
						adss:'',
						job:'stuff',
						inductDate:new Date().toLocaleDateString(),
					},
				pickerOptions:{
				/* 比2001.1.1大的都失效*/	
					disabledDate(time) {
					return time.getTime()+3600 * 1000 * 24 > new Date("2001/01/01 00:00:00").getTime();
					}
				},
				options: regionDataPlus,
				selectedOptions: [],
				selectedzn:[],
				dialogFormVisible:true
			};
		},
		methods:{
				sureAdd:function(){
					var y=this.selectedOptions;
					for(var i = 0; i < y.length; i++){
						this.selectedzn.push(CodeToText[y[i]]);
					}
					this.form.adss=this.selectedzn;
					this.$axios.post("induction",this.form).then(v=>{
						console.log(v)
						if(v.data){
							this.$message.success("录入入职信息成功！！")
							//alert("录入入职信息成功！！");
							this.$router.push("/home/querydept");
						}else{
							this.$message.error("出错了！！")
							//alert("出错了！！");
						}
					}).catch(ex=>{
						this.$message.error("出错了！！")
						//alert("出错了！"+ex);
					})
					//location.href='#/home/querydept';
	
				},
				handleChange (value) {	
					console.log(value)
				}
		}
	}
</script>

<style>
	.indbox{
		width:900px;
		height:600px;
		border:1px solid #FFFFFF;
		background:#FFFFFF;
	}
	.indbox .el-form{
		margin:0 auto;
		width:550px;
	}
	.indbox .el-input{
		width:400px;
		float:left;
	}
	
</style>
